<p>
  bind works!
</p>
<!--dom属性绑定-->
<img [src]="imgUrl">
<br>
<img src="{{imgUrl}}">
<br>
<!--单项绑定，模板到控制器-->
<input value="tom" (input)="doOnInput($event)">
<br>
<!--单项绑定，控制器到模板-->
<input [value]="name" >
<br>
<!--双向绑定-->
<input [(ngModel)]="name" />  {{name}}
<br>
<button disabled="false">点我</button>
<br>

<!--html属性绑定-->
<input [attr.value]="greeting">

<br>

<!--单个class绑定-->
<div class="a b" [class.c]="isBig">文字</div>

<!--多个class绑定-->
<div [ngClass]="divClass">文字</div>

<!--单个样式绑定，注意字符串-->
<div [style.color]="isDev ? 'red' : 'green'">文字</div>

<!--多个样式绑定-->
<div [ngStyle]="divStyle">文字</div>


<!--管道-->
<div>我的生日是{{myBirthday | date | uppercase}}</div>
<!--大写HH为24小时，小写为12小时-->
<div>我的生日是{{myBirthday | date:"yyyy=MM-dd HH:mm:ss"}}</div>

<!--第一个2是2为整数，2-2为最少小数几位和最多小数保持几位-->
<div>圆周率是{{pi | number:"2.2-2"}}</div>

<!--自定义管道,"2"是传递参数方式-->
<div>试试我自己的管道{{size | mutiple:"2"}}</div>


